
<div class="CenterHeaderBox RollingGoal">
    <div class="CenterBackBtn"><a href="javascript:history.go(-1)"><img src="__CDN__/map/images/return.png" alt="返回"/></a></div>
    <div class="CenterHeaderTitle">我的积分</div>
</div>

<div class="CenterMain" >
    <div class="BalanceTop gradualBg">
        <div class="BalanceNumerical am-cf">
            <div class="BalanceNum am-fl">
                <p class="p2">{$user.integral}</p>
                <p class="p1">我的积分</p>
            </div>


        </div>
    </div>
    <div class="BalanceList" >
        <div class="title">积分明细</div>
        <div class="BalanceDetail"  style="position: absolute;width:100%;height: 140%;overflow-y:auto;-webkit-overflow-scrolling: touch;" >
            <ul id="ul">

            </ul>
        </div>

    </div>


</div>
<style>
    .BalanceTop{padding-top:1.7rem;}
    .BalanceNum{padding:0;}
    .BalanceNum{text-align: center;width: 100%;}
    p.p1{margin-top:0.1rem;}
    .BalanceNum p .p2{font-size:0.76rem;margin-bottom:0;line-height: 0.6rem;}
    .BalanceDetail #ul li{height: 1.4rem;}
    .textR{color: #FFA300;}
</style>
<script type="text/javascript" src="__CDN__/assets/js/zepto.min.js"></script>
<script type="text/javascript" src="__CDN__/assets/js/PullToRefresh.min.js"></script>
<script>

    var n=0,flag=true;

    var refreshBox=new PullToRefresh({
        container:".BalanceDetail",
        pull:{
            callback:function(){
                setTimeout(function(){
                    n=0
                    re_ajax(n)
                    refreshBox.endPullRefresh(true)
                },1000)
            }
        },
        up:{
            callback:function(){

                setTimeout(function(){
                        n++
                        re_ajax(n)
                        refreshBox.endUpLoading(flag)

                },1000)
            }
        }
    })
    function re_ajax(page){
        $.ajax({
            type:"GET",
            url:"{$http_url}/index/user/integral",
            dataType:"json",
            data:{
                page:page,

            },
            success:function(data){
                if(page==1||page==0){
                    $('#ul').html('');
                }
                var html='';
                data.data.forEach(function (v) {
                    var name='';
                    if(v.type==1){
                        name='注册积分';
                    }else if(v.type==2){
                        name='积分';
                    }else if(v.type==3){
                        name='推荐积分';
                    }else if(v.type==4){
                        name='首次下载积分';
                    }else if(v.type==5){
                        name='二级消费积分';
                    }else if(v.type==6){
                        name='消费积分';
                    }
                        html+='<li class="am-cf">';
                        html+='<div class="textL am-fl">';
                        html+='  <p class="p1"><span>'+name+'</span> </p> ';
                        html+='  <p class="p2">'+v.createtime+'</p>';
                        html+='</div>';
                        html+='<div class="textR am-fr">+'+v.integral+'</div>';
                        html+='</li>';
                })
                // $("#ul")[type](html)
                $('#ul').append(html);
                if(html==''){
                    flag=false;
                }
            },
            error:function(jqXHR){
                console.log("Error: "+jqXHR.status);
            }
        });
    }


</script>


